<template>
  <view class="dbox bd">
    <u-cell-group v-for="(item, index) in list">
      <u-cell-item
        class="bd1 t1"
        icon="bell"
        :title="item.content"
        :value="item.createDates"
        :title-style="texts"
        @click="goText(index)"
      ></u-cell-item>
    </u-cell-group>
    <image
      class="edit"
      src="../../../static/img/3e3b2db473784873887377acebd78fff.png"
      mode="widthFix"
      @click="goAdd"
    ></image>
    <!-- <u-icon name="plus-circle-fill" class="icons" @click="goAdd"></u-icon> -->
  </view>
</template>

<script>
export default {
  data() {
    return {
      list: [],
      texts: {
        width: "300rpx",
        overflow: "hidden",
        textOverflow: "ellipsis",
        whiteSpace: "nowrap",
      },
    };
  },
  onLoad() {
    this.getFamilyList();
  },
  onShow() {
    this.getFamilyList();
  },
  onReady() {
    // this.getUiStyle();
  },
  methods: {
    getUiStyle() {
      var style = plus.navigator.getUiStyle();
      if ("dark" == style) {
        console.log("当前为暗黑模式");
        uni.setTabBarStyle({
          backgroundColor: "#1B1C1E",
        });
        uni.setNavigationBarColor({
          frontColor: "#ffffff",
          backgroundColor: "#1B1C1E",
          animation: {
            duration: 400,
            timingFunc: "easeIn",
          },
        });
      } else {
        console.log("当前为普通模式");
      }
    },
    // 获取家庭组列表
    getFamilyList() {
      let self = this;
      uni.showLoading({
        title: "加载中",
        mask: true,
      });
      setTimeout((s) => {
        uni.hideLoading();
      }, 5000);
      this.config
        .post("/feedbackData/getList", {
          pageNum: 1,
          pageSize: 99,
        })
        .then((res) => {
          uni.hideLoading();
          if (res.data.code === 200) {
            this.list = res.data.data.list;
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
    goText(v) {
      let uid = this.list[v].id;
      uni.navigateTo({
        url: "/pages/main/pub/feedback-text?id=" + uid,
      });
    },
    goAdd() {
      uni.navigateTo({
        url: "/pages/main/pub/feedback-add",
      });
    },
  },
};
</script>

<style lang="less" scoped>
.dbox {
  padding: 20rpx;

  .innerbox {
    border-bottom: 1px solid #cacaca;
    margin: 10px;
    height: 60rpx;
    line-height: 60rpx;

    .texts {
      width: 400rpx;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
  .icons {
    position: fixed;
    color: #bebebe;
    font-size: 100rpx;
    right: 0;
    bottom: 200rpx;
    z-index: 99;
  }
  .edit {
    width: 120rpx;
    height: 120rpx;
    border-radius: 50%;
    background-color: #84e1ef;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: 10%;
    bottom: 20%;
    z-index: 1111;
  }
}
</style>
<style scoped>
@media (prefers-color-scheme: closedark) {
  .bd {
    height: calc(100vh - var(--window-top));
    background-color: #1b1c1e !important;
  }
  .bd1 {
    background-color: #1b1c1e !important;
  }
  .t1 {
    color: #ccc !important;
  }
}
</style>